import React, { Component } from 'react';
import { HashRouter as Router, Route, Switch } from 'react-router-dom'
import './App.css';
import './assets/css/iconfont.css'
import './assets/css/pc.css'
import './assets/css/mobile.css'
import PCIndex from './components/PC/pc_index';
import MobileIndex from './components/Mobile/mobile_index';
import MediaQuery from 'react-responsive'
import PCNewsDetail from './components/PC/pc_news_details'
import MobileNewsDetails from './components/Mobile/mobile_news_details';
import PCUserCenter from './components/PC/pc_usercenter'
import MobileUserCenter from './components/Mobile/mobile_usercenter'

class App extends Component {
  render() {
    return (
      <div>
        <MediaQuery query="(min-device-width: 1224px)">
          <Router>
            <Switch>
              <Route exact path='/' component={PCIndex}></Route>
              <Route path='/detail/:uniquekey' component={PCNewsDetail}></Route>
              <Route path='/usercenter' component={PCUserCenter}></Route>
            </Switch>
          </Router>
        </MediaQuery>
        <MediaQuery query="(max-device-width: 1224px)">
          <Router>
            <Switch>
              <Route exact path='/' component={MobileIndex}></Route>
              <Route path='/detail/:uniquekey' component={MobileNewsDetails}></Route>
              <Route path='/usercenter' component={MobileUserCenter}></Route>
            </Switch>
          </Router>
        </MediaQuery>
      </div>
    );
  }
}

export default App;
